import Inline from "quill/blots/inline";
import Block, { BlockEmbed } from "quill/blots/block";
import Embed from "quill/blots/embed";
import Text from "quill/blots/text";
import { Blot, BlotConstructor, EmbedBlot, InlineBlot, Root } from "parchment";
import Break from "quill/blots/break";
import Quill, { Parchment } from "quill";

// 自定义Attributes
// import { attribute } from "./attributors.ts";

let p = new Parchment.Registry();

class ReferenceNode extends Inline {
  static className: string = "reference-node";
  static tagName: string = "span";
  static blotName: string = "reference-node";
  constructor(scroll: Root, domNode: Node) {
    super(scroll, domNode);
  }
  static create(value: string) {
    const root = super.create();

    root.textContent = value;

    return root;
  }
}
class ReferenceName extends Inline {
  static className: string = "reference-name";
  static blotName: string = "reference-name";
  static tagName: string = "span";
  static create(value: string) {
    const root = super.create();

    root.textContent = value;

    return root;
  }
}

// class ReferenceBlock extends BlockEmbed {
class ReferenceBlock extends Embed {
  // static allowedChildren: BlotConstructor[] = [ReferenceNode, ReferenceName];
  static blotName: string = "reference-block";
  static className: string = "reference-block";
  static tagName: string = "div";

  constructor(scroll: any, node: HTMLElement) {
    super(scroll, node);

    // attribute.add(this.domNode as HTMLElement, 500);
    // this.format("hboot-width", 500);
  }
  static create(value: {
    id: string;
    name: string;
    label: string;
    children: Blot[];
  }) {
    const root = super.create() as HTMLElement;

    // const root = document.createElement("div");
    // 将占位符值作为节点的属性保存
    root.dataset.id = value.id;
    root.dataset.name = value.name;
    root.dataset.label = value.label;
    // root.setAttribute("contenteditable", "false"); // 禁用编辑

    const label = document.createElement("span");
    label.classList.add("reference-node-name");
    label.textContent = value.label;

    root.appendChild(label);

    const text = document.createElement("span");
    text.classList.add("reference-node-key");
    text.textContent = "·" + value.name;

    root.appendChild(text);

    return root;
  }
  // optimize(context: { [key: string]: any }): void {
  //   super.optimize(context);
  // }
  format(name: string, value: any): void {
    console.log("format", name, value);

    super.format(name, value);
  }
  // insertAt(index: number, value: string, def?: any): void {
  //   super.insertAt(index, value, def);
  // }
  // static formats(node: HTMLElement) {
  //   return {
  //     id: node.dataset.id,
  //     name: node.dataset.name,
  //     label: node.dataset.label,
  //   };
  // }
  static value(node: HTMLElement) {
    return {
      id: node.dataset.id,
      name: node.dataset.name,
      label: node.dataset.label,
    };
  }
}

ReferenceNode.requiredContainer = ReferenceBlock;
ReferenceName.requiredContainer = ReferenceBlock;

export { ReferenceBlock, ReferenceNode, ReferenceName };
